<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>错误页面</title>
    <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
    <style type="text/css">
        #main {
            font-family: Consolas,serif;
            text-align: center;
            margin: auto;
            position: absolute;
            width: 300px;
            height: 300px;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
        }
        #code {
            font-size: 100px;
        }
        #error {
            font-size: 20px;
        }
    </style>
</head>
<body>

<div id="main">
    <strong>
        <span id="code">500</span>
        <span id="error">error</span>
    </strong>
    <h2>抱歉,服务器发生了异常</h2>
    <span id="time"></span>秒后返回首页
    <a href="index.html">立即返回</a>
</div>

<script type="text/javascript">
    let n = 3;
    $(function () {
        $("#time").text(n);
        setInterval(function () {
            if (n <= 1) {
                location.href = "index.html";
            } else {
                $("#time").text(--n);
            }
        }, 1000);
    })
</script>

</body>
</html>